<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="author" content="计科2411-32-赵红云">
    <title>综合应用</title>
</head>

<body>
    <h4>前端开发工程师 | 教师</h4>
    <ul>
        <li><a href="#about">关于我</a></li>
        <li><a href="#skill">技能</a></li>
        <li><a href="#edu">
                <font color="#0000FF">教育背景</font>
            </a></li>
        <li><a href="#contact">
                <font color="#0000FF">联系我</font>
            </a></li>
    </ul>
    <h2>关于我</h2>
    <img src="卡通.jpg" alt="卡通" width="80" height="80" />
    <h3>个人简介</h3>
    <p>我是一名热爱<b>前端开发</b>的教师,拥有4年的网页开发经验,我专注于<mark>客户友好</mark>且<mark>响应式</mark>的网页设计。</p>
    <h3>联系方式</h3>
    邮箱: <a href="#">
        <font color="#0000FF">sanri@example.com</font>
    </a><br>
    电话： <a href="#">
        <font color="#0000FF">+86 138 0000 8000</font>
    </a>
    <br>
    地址: <span>天津市河西区</span>
    <h3>技能展示</h3>
    <table border="1">
        <caption>
            我的技能水平
        </caption>
        <tr>
            <th>技能</th>
            <th>熟练程度</th>
            <th>使用时间</th>
        </tr>
        <tr>
            <td>HTML</td>
            <td>
                <progress value="80" max="100"></progress>
            </td>
            <td>3年</td>
        </tr>
        <tr>
            <td>CSS</td>
            <td>
                <progress value="80" max="100"></progress>
            </td>
            <td>3年</td>
        </tr>
        <tr>
            <td>JavaScript</td>
            <td>
                <progress value="70" max="100"></progress>
            </td>
            <td>2年</td>
        </tr>
        <tr>
            <td>响应式设计</td>
            <td>
                <progress value="75" max="100"></progress>
            </td>
            <td>2年</td>
        </tr>
    </table>
    <h2>教育背景</h2>
    <table border="1">
        <tr>
            <th>时间</th>
            <th>学校</th>
            <th>专业</th>
            <th>学历</th>
        </tr>
        <tr>
            <td>2000-2007</td>
            <td>某某大学</td>
            <td>计算机科学与技术</td>
            <td>本科</td>
        </tr>
        <tr>
            <td>1997-1999</td>
            <td>某某高级中学</td>
            <td>理科</td>
            <td>高中</td>
        </tr>
    </table>
    <h2>我的介绍视频</h2>
    <video src="art.mp4" width="300" controls></video>
    <h3>我的工作环境音乐</h3>
    <audio src="Serenade.mp3" controls></audio>
    <h2>联系我</h2>
    <form action="URL" mehtod="get">
        <fieldset>
            <legend>
                个人信息
            </legend>
            <p>姓名:
                <input type="text" name="xing">
            </p><br>
            <p>邮箱:
                <input type="email" name="you">
            </p><br>
            <p>电话:
                <input type="tel" neme="dian">
            </p><br>
        </fieldset>
    </form>
    <form action="URL" mehtod="get">
        <fieldset>
            <legend>
                留言板
            </legend>
            <p>留言时间:
                <input type="date" name="nyr>">
            </p><br>
            <p>留言:
                <textarea cols="50" rows="4"></textarea>
            </p><br>
            <p>
                <input type="submit" value="提交">
            </p>
        </fieldset>
    </form>
    <p>2025 赵红云的个人主页,保留所有权利.</p>
    关注我：<a href="#">
        <font color="#0000FF">Gitee |</font>
    </a>






</body>

</html>